<template>
  <div class="chat-echarts">
    <component :is="chartCompType" :data="data"></component>
  </div>
</template>
<script>
import chartLine from "@/components/echarts/chartLine/chartLine";
import chartLineSW from "@/components/echarts/chartLine/chartLineSW";
import chartBarSW from "@/components/echarts/chartBar/chartBarSW";
import chartBarLineSW from "@/components/echarts/chartBar/chartBarLineSW.vue";
import chartKLine from "@/components/echarts/chartLine/chartKLine";

export default {
  name: "chatEcharts",
  components: { chartLine, chartLineSW, chartBarSW, chartBarLineSW, chartKLine },
  props: {
    data: {
      type: Object,
      default: () => {},
    },
  },
  computed: {},
  data() {
    return {
      chartCompType: "",
    };
  },
  created() {},
  mounted() {},
  methods: {},
  watch: {
    data: {
      deep: true,
      immediate: true,
      handler(newVal) {
        //newVal:chart::Line/chart::Line::SW  拼接成chartLine/chartLineSW组件名
        let type = newVal.type.split("::");
        this.chartCompType = type.join("");
        console.log("chartCompType", this.chartCompType);
      },
    },
  },
};
</script>
<style lang="scss" scoped></style>
